<template>
	<div class="query">
		<div class="check">
			<div class="c_left">条件搜索栏</div>
			<div class="c_right clear">
				<div class="fl">
					<span class="c_tip">搜索关键字</span>
					<input type="text" class="c_input" v-model="srm" placeholder="请输入关键字">
				</div>
				<div class="fl" style="margin-left:10px;">
					<el-button type="primary" class="btn_clear" @click="searchFun">搜索</el-button>
				</div>
			</div>
		</div>
		<div class="list_tip clear">
			<!-- <span class="fl">数据管理列表</span> -->
		</div>
		<div class="table_box">
			<vxe-grid border resizable :seq-config="{startIndex: (query.page - 1) * query.limit}"
			:header-cell-style="tableHead"
			:cell-style="tableBody"
			:columns="tableColumn" :data="tableData" :edit-config="{trigger: 'click', mode: 'cell'}" @edit-closed="editClosedEvent"></vxe-grid>
			<pagination
			  :total="query.total"
			  :page.sync="query.page"
			  :limit.sync="query.limit"
			  @pagination="getList"
			/>
		</div>
	</div>
</template>

<script>
	export default {
		data () {
			return {
				srm:"",
				query: {
				  total: 0,
				  page: 1,
				  limit: 10
				},
				tableColumn: [
					{
						type: 'seq',
						width: 60,
						title:"序号"
					},
				  {
				    field: "JYJGDM",
				    label: "报告项目代码"
				  },
				  {
				    field: "JYJGMC",
				    label: "报告项目名称"
				  },
				  {
				    field: "LX",
				    label: "类型(可编辑)",
					editRender:{ name: '$select',
						options: [
							 {value:"-1",label:"不确定"},
							 {value:"1",label:"白细胞计数(YBC)"},
							 {value:"2",label:"中性粒细胞比率(N)"},
							 {value:"3",label:"红细胞计数(R3C)"},
							 {value:"4",label:"红细胞压积(Het)"},
							 {value:"5",label:"血小板计数(PLT)"},
							 {value:"6",label:"血红蛋白(Hb)"},
							 {value:"7",label:"血清总胆红素(TBIL)"},
							 {value:"8",label:"直接胆红素(IBIL)"},
							 {value:"9",label:"间接胆红素(IBIL)"},
							 {value:"10",label:"谷丙转氨酶"},
							 {value:"11",label:"谷草转氨酶"},
							 {value:"12",label:"血清总蛋白(A)"},
							 {value:"13",label:"血清白蛋白(TP)"},
							 {value:"14",label:"血清肌酐"},
							 {value:"15",label:"血尿素氮"},
							 {value:"16",label:"血钾"},
							 {value:"17",label:"血纳"},
							 {value:"18",label:"其他"}
						],
						attrs: {type: 'label'},
					}
				  },
				  {
				    field: "YLLB",
				    label: "药历类别(可编辑)",
					editRender:{ name: '$select',
						options: [
							 {value:"-1",label:"未维护"},
							 {value:"1",label:"其他"}
						],
						attrs: {type: 'label'},
					}
				  },
				  {
				    field: "JYJGCKFW",
				    label: "检验结果参考范围"
				  },
				  {
				    field: "JYJGDW",
				    label: "检验结果标准单位"
				  },
				  {
				    field: "JYJGSC",
				    label: "检验结果是否参与审查(可编辑)",
					editRender:{ name: '$select',
						options: [
							 {value:"0",label:"否"},
							 {value:"1",label:"是"}
						],
						attrs: {type: 'label'},
					}
				  },
				  {
				    field: "MATCHUSER",
				    label: "操作人"
				  },
				  {
				    field: "MATCHTIME",
				    label: "操作时间",
					formatter:"formatDate"
				  }
				],
				tableData: [],
			}
		},
		mounted () {
			this.getList();
		},
		methods:{
			tableHead ({row,rowIdx}) {
				return "background:#409efe;color:#fff;font-size:12px;height:36px;padding:0;line-height:36px;text-align:center;border:0;"
			},
			tableBody({row, column, rowIndex, columnIndex}){
				var style = "padding:0;font-size:12px;color:#8b8b8b;border:0;border-right:1px solid #d9f1f3;"
				if(rowIndex%2 != 0){
					if(columnIndex == 12){
						style += "border:0;"
					}
					style += "height:36px;line-height:36px;background:#eaf4fe;"
			
				}
				if(rowIndex%2 == 0){
					if(columnIndex == 12){
						style += "border:0;"
					}
					style += "height:44px;line-height:44px;background:#fff;"
				}
				return style;
			},
			searchFun(){
				this.query.page = 1;
				this.getList();
			},
			async getList () {
				let res = await this.$custom.dictLabItemData({
					srm:this.srm,
					page:this.query.page,
					pageSize:this.query.limit
				})
				// if(res.code == 200){
					this.query.total = res.total;
					for(var i in res.rows){
						res.rows[i].MATCHTIME=parseInt(res.rows[i].MATCHTIME)*1000;
					}
					this.tableData = res.rows;
				// }
			},
			async editClosedEvent ({ row, column }, event) {
			  let res=await this.$custom.dictLabItemUpdata({id:row.ID,jyjgdm:row.JYJGDM,jyjgmc:row.JYJGMC,Jyjgsc:row.JYJGSC,lx:row.LX,yllb:row.YLLB});
			  this.$message({
			  	message:res.msg,
			  	type:res.code == 1 ? "success" : "error",
			  	duration:1500
			  })
			  this.getList();
			}
		}
	}
</script>

<style lang="scss" scoped="scoped">
	body{
		background:#e6edf5;
	}
	.query{
		width:100%;
		height:100%;
		background:#e6edf5;
		.check{
			font-size:12px;
			display:flex;
			line-height:60px;
			background:#fff;
			text-align:center;
			.c_left{
				width:115px;
				float:left;
			}
			.c_right{
				overflow:hidden;
				color:#636365;
				border-left:1px solid #e6edf5;
				.c_tip{
					display:inline-block;
					width:100px;
					padding-right:10px;
					text-align:right;
				}
				.c_input{
					width:150px;
					height:40px;
					border:1px solid #dcdfe6;
					border-radius:4px;
					padding-left:5px;
				}
				.c_input::-webkit-input-placeholder {
					color: #dcdfe6;
				}
				.c_input::-ms-input-placeholder {
					color: #dcdfe6;
				}
				.c_input::-moz-input-placeholder {
					color: #dcdfe6;
				}
				.c_search{
					width:100px;
				}
				.c_searchbtn{
					display:inline-block;
					width:42px;
					height:25px;
					margin-left:4px;
					background:#28a4f4;
					color:#fff;
					font-size:12px;
					text-align:center;
					line-height:26px;
					border-radius:6px;
					cursor:pointer;
				}
				.c_checkbox{
					width:230px;
					height:40px;
					display:inline-block;
					margin-left:-12px;
				}
				.btn_clear{
					padding:0;
					width:70px;
					height:40px;
					line-height:40px;
				}
			}
		}
		.list_tip{
			font-size:14px;
			color:#29a4f2;
			padding:10px 18px;
		}
		.table_box{
			padding:0 18px;
		}
	}
	.el-checkbox__label{
		padding-left:5px;
	}
	.el-checkbox{
		margin-right:10px;
	}
	.el-form-item{
		margin-bottom:5px;
	}
	.departSearch{
		text-align:left;
		line-height:50px;
		.fl{
			margin-right:30px;
		}
	}
</style>
